import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:xin_he/page/login/xin_he_register/xin_he_register_view.dart';
import 'package:xin_he/utils/xh_styles.dart';
import 'package:xin_he/utils/xin_he_image.dart';
import 'package:xin_he/utils/xin_he_input_widget.dart';

import '../../../routes/xin_he_routes.dart';
import 'xin_he_login_logic.dart';

class XinHeLoginPage extends StatelessWidget {
  XinHeLoginPage({Key? key}) : super(key: key);

  final logic = Get.put(XinHeLoginLogic());
  final state = Get.find<XinHeLoginLogic>().state;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: (){
        logic.keyboardBack();
      },
      child: Container(
        width: Get.width,
        height: 404+Get.mediaQuery.padding.bottom,
        color: Colors.transparent,
        child: Stack(children: [

          Positioned(
              top: 33,
              bottom: 0,
              child: XinHeAssetImage('assets/images/login/login_bg.png',width: Get.width,height: 371+Get.mediaQuery.padding.bottom,)
          ),

          Positioned(
              left: 0,
              bottom:0 ,
              right: 0,
              child: Container(
                height: 404+Get.mediaQuery.padding.bottom,
                // height: Get.height,
                width: Get.width,
                padding: const EdgeInsets.symmetric(horizontal: 37.5),
                color: Colors.transparent,
                child: Column(children: [

                  XinHeAssetImage('assets/images/login/avatar.png',width: 65,height: 65,),
                  SizedBox(height: 35,),
                  Container(
                    alignment: Alignment.centerLeft,
                    padding: EdgeInsets.symmetric(horizontal: 15),
                    height: 45,
                    decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(22.5),
                        border: Border.all(color: XinHeStyle.mainGreenColor,width: 0.5)),
                    child: Row(children: [
                      XinHeAssetImage('assets/images/login/login_phone.png',width: 19,height: 19,),
                      SizedBox(width: 5,),
                      Expanded(child: XinHeInputWidget(
                        '',
                        '请输入您的手机号',
                            (value){logic.onPhoneChange(value);},
                        keyboardType: TextInputType.phone,
                        maxInputLength: 11,
                        isHiddenLine: true,
                       )
                      )
                    ],),
                  ),

                  SizedBox(height: 15,),

                  ///  密码框
                  Container(
                    alignment: Alignment.centerLeft,
                    padding: const EdgeInsets.symmetric(horizontal: 15),
                    height: 45,
                    decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(22.5),
                        border: Border.all(color: XinHeStyle.mainGreenColor,width: 0.5)),
                    child: Row(children: [
                      const XinHeAssetImage('assets/images/login/login_pwd.png',width: 19,height: 19,),
                      const SizedBox(width: 5,),
                      Expanded(child: XinHeInputWidget('', '请输入6-16位密码', (value){
                        logic.onPWChange(value);
                      },
                        keyboardType: TextInputType.text,maxInputLength: 16,isHiddenLine: true,))
                    ],),
                  ),

                  Text('初始密码123456',style: TextStyle(color: Colors.deepOrange,fontSize: 12),),


                  forgotPwAndRes(),

                  GestureDetector(
                    onTap: (){
                      logic.userLogin();
                    },
                    child: Container(
                      margin:  const EdgeInsets.only(left: 0,right: 0,top: 40),
                      height: 45,
                      width: double.infinity,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(color:  XinHeColor('#10C9C9'),borderRadius: BorderRadius.all(Radius.circular(22.5))),
                      child: Text (
                        "登录",
                        style: TextStyle (fontSize: 16,color:  Colors.white,fontWeight: FontWeight.w600) ,
                      ),),
                  ),

                  Container(
                    margin: EdgeInsets.only(top: 20),

                    child: Text('·芯禾智慧认养农业·',style: TextStyle(color: XinHeColor('#1CA6A1'),fontSize: 13),),
                  )


                ],),
              )
          ),


        ],),
      ),
    );
  }

  Widget forgotPwAndRes() {
    return Container(
      // color: Colors.red,
      margin: const EdgeInsets.symmetric(horizontal: 44)
          .copyWith(top: 18),
      width: Get.width,
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [

          SizedBox(
            height: 20,
            width: 60,
            child: MaterialButton(
              padding: const EdgeInsets.only(top: 0, left: 0),
              onPressed:(){

                logic.keyboardBack();
                // Get.back();
                Get.bottomSheet(XinHeRegisterPage(),persistent: false,isScrollControlled: true);

              },
              child: Text(
                '立即注册',
                style: TextStyle(color: XinHeColor('#0B6262'),fontSize: 13),
              ),
            ),
          ),

          Container(
            // color: Colors.red,
            height: 20,
            width: 60,
            margin: const EdgeInsets.only(right: 0),
            child: MaterialButton(
              padding: const EdgeInsets.only(top: 0, left: 0),
              onPressed: (){
                logic.keyboardBack();
                Get.toNamed(XinHeRoutes.forgetPwd);
              },
              child: Text(
                '忘记密码',
                style: TextStyle(color: XinHeColor('#08AFAF'),fontSize: 13),
              ),
            ),
          ),
        ],
      ),
    );
  }

}
